<template>
  <el-select v-model="colorCode" placeholder="请选择">
    <el-option
      v-for="item in colorOption"
      :key="item.name"
      :label="item.name"
      :value="item.code">
      <div style="display: flex;justify-content: space-between;align-items: center;padding: 0px 5px">
        <div style="display: inline-block">{{item.name}}</div>
        <div :style="`background-color: ${item.value};`" style="display: inline-block;border-radius: 50%;width:18px;height:18px"></div>
      </div>
    </el-option>
  </el-select>
</template>

<script>
import {accountColorList} from '../../../../api/customer/commom'
export default {
  name: 'ColorSelect',
  data () {
    return {
      colorOption: accountColorList,
      colorCode: ''
    }
  }
}
</script>

<style scoped>

</style>
